<!DOCTYPE html>
<html class="x-admin-sm">
{include file='public/header'}
<script src="/admin/xadmin/lib/layui/upload.js" charset="utf-8"></script>
<style>
    .layui-form-label{
        width: 95px;
    }
    .layui-input-block{
        margin-left: 125px;
    }
</style>
<body>
    <div class="x-body">
        <form class="layui-form" lay-filter="formAjax">
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>名称
                </label>
                <div class="layui-input-block">
                    <input type="text" name="name" id="name" placeholder="名称" required="required"
                        lay-verify="required" autocomplete="off" class="layui-input" value="" />
                </div>
            </div>
            <div class="layui-form-item" style="display: flex;">
                <label class="layui-form-label">
                   充值模板限制 
                </label>
                <div id="ptLimi" style="width: 100%;flex:1"></div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    视频类型
                </label>
                <div id="videoType"></div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>封面地址
                </label>
                <button type="button" class="layui-btn" id="video_btn">上传</button>
                <div class="layui-upload-list" style="display: none;margin-left: 125px;">
                    <img onclick="showimg(this)" class="layui-upload-img" style="width: 100px;">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>播放平台
                </label>
                <div class="layui-input-block">
                    <input type="checkbox" id="wx_play_platform" name="play_platform[]" lay-skin="primary" value="1" title="微信小程序" lay-verify="checkboxRequired">
                    <input type="checkbox" id="dy_play_platform" name="play_platform[]" lay-skin="primary" value="2" title="抖音小程序" lay-verify="checkboxRequired">
                    <input type="checkbox" id="ks_play_platform" name="play_platform[]" lay-skin="primary" value="3" title="快手小程序" lay-verify="checkboxRequired">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    标签类型
                </label>
                <div class="layui-input-block">
                    <input type="radio" name="type" lay-skin="primary" value="0" title="无" checked>
                    <input type="radio" name="type" lay-skin="primary" value="1" title="最新" >
                    <input type="radio" name="type" lay-skin="primary" value="2" title="热门">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>投放时间
                </label>
                <div class="layui-input-block">
                    <input type="text" name="launch_start_time" class="layui-input" required="required" lay-verify="required" id="launch_start_time" placeholder="请选择投放时间">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>标签名
                </label>
                <div class="layui-input-block">
                    <input type="text" name="label" id="label" placeholder="标签名" required="required"
                        lay-verify="required" autocomplete="off" class="layui-input" value="" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>总集数
                </label>
                <div class="layui-input-block">
                    <input type="text" name="sylloge" id="sylloge" placeholder="总集数" required="required"
                        lay-verify="required" autocomplete="off" class="layui-input" value="" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>简介
                </label>
                <div class="layui-input-block">
                    <textarea type="text" name="synopsis" id="synopsis" placeholder="简介" required="required"
                        lay-verify="required" autocomplete="off" class="layui-textarea" value=""></textarea>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>付费状态
                </label>
                <div class="layui-input-block">
                    <input type="radio" name="is_free" value="0" title="免费" checked>
                    <input type="radio" name="is_free" value="1" title="付费">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>上架状态
                </label>
                <div class="layui-input-block">
                    <input type="radio" name="is_shelves" value="0" title="否" checked>
                    <input type="radio" name="is_shelves" value="1" title="是">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    显示搜索
                </label>
                <div class="layui-input-block">
                    <input type="radio" name="is_search" value="0" title="否" checked>
                    <input type="radio" name="is_search" value="1" title="是">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    是否推荐
                </label>
                <div class="layui-input-block">
                    <input type="radio" name="is_recommended" value="0" title="不推荐" checked>
                    <input type="radio" name="is_recommended" value="1" title="推荐">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>是否备案剧
                </label>
                <div class="layui-input-block">
                    <input type="radio" lay-filter="is_filings" name="is_filings" value="0" title="否" checked>
                    <input type="radio" lay-filter="is_filings" name="is_filings" value="1" title="是">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    合作方
                </label>
                <div id="pMenu"></div>
            </div>
            <div class="partners cooperation_mode" style="display: none;">
                <div class="layui-form-item">
                    <label class="layui-form-label">
                        合作方式
                    </label>
                    <div class="layui-input-block">
                        <input type="radio" name="cooperation_mode" value="1" title="分成" checked>
                        <!-- <input type="radio" name="cooperation_mode" value="2" title="独家"> -->
                        <!-- <input 
                            type="radio" name="cooperation_mode" value="3" title="买断"> -->
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">
                        分成比例
                    </label>
                    <div class="layui-input-block">
                        <input type="number" name="scale" id="scale" placeholder="分成比例" autocomplete="off" class="layui-input" value="" />
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    排序
                </label>
                <div class="layui-input-block">
                    <input type="text" name="sort" id="sort" placeholder="排序" autocomplete="off" class="layui-input" value="" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    是否复制剧
                </label>
                <div class="layui-input-block">
                    <input type="radio" lay-filter="is_copy" name="is_copy" value="0" title="否" checked>
                    <input type="radio" lay-filter="is_copy" name="is_copy" value="1" title="是">
                </div>
            </div>
            <div id="cooperation_time" style="display: none;">
                <div class="layui-form-item">
                    <label class="layui-form-label">
                        合作时间
                    </label>
                    <div class="layui-inline" id="hztime" style="display: flex;align-items: center;">
                        <div class="layui-input-inline" style="margin-right:10px">
                            <input type="text" class="layui-input" name="cooperation_start_time" id="start_time" autocomplete="off" placeholder="开始时间">
                        </div>
                        <div class="layui-form-mid">-</div>
                        <div class="layui-input-inline">
                            <input type="text" class="layui-input" name="cooperation_end_time" id="end_time" autocomplete="off" placeholder="结束日期">
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">
                        原剧选择
                    </label>
                    <div id="pVideo"></div>
                </div>
            </div>
            <div id="choosePerson">
                <div class="layui-form-item" style="display: flex;">
                    <label class="layui-form-label">
                        选择分销商
                    </label>
                    <div id="personList" style="width: 100%;flex: 1;"></div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    设置微信切流剧目ID
                </label>
                <div class="layui-input-block">
                    <input type="text" name="drama_id" id="drama_id" placeholder="请设置剧目ID" autocomplete="off" class="layui-input" value="" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    设置观看金额
                </label>
                <div class="layui-input-block">
                    <input type="text" name="is_money" id="is_money" placeholder="0为不设置，其他都会判断用户充值金额是否足够才能观看" autocomplete="off" class="layui-input" value="" />
                </div>
            </div>
            <input type="hidden" name="id" id="id" value="" />
            <input type="hidden" name="cover_img" id="cover_img" value="" />
            <button id="submitData" class="layui-btn" lay-submit lay-filter="submitData" style="display: none;" />
        </form>
    </div>
    <script>
        let params = {
            addUrl: '/admin/video/add',
            editUrl: '/admin/video/edit',
            detailUrl: '/admin/video/detail',
        }
        form_ajax(params)

        //查询充值模板限制
        let xmSelectGetAuthorizersOption = {
            url:'/admin/money/limitTemplateSelect',
            initValue:'',//初始值
            el:'#ptLimi',
            showCount:5,
            radio:true,
            clickClose:true,
            direction:'down',//下拉方向
            name:'recharge_limit_template_id',
            label: {
                type: 'text',
            },
            prop: {
                value: 'id',
            },
        }

        let selectParams = {
            url:'/admin/partners/select',
            elem: '#pMenu',
            selected: [],
            max: 1,
            tips: '选择合作方',
            name: 'partners_id',
            field_id:'id',
            field_Name:'name',
        }
        let videoType = {
            url:'/admin/type/select',
            elem: '#videoType',
            selected: [],
            max: 1,
            tips: '选择视频分类',
            name: 'video_type_id',
            field_id:'id',
            field_Name:'name',
        }
        let selectVideo = {
            url: '/admin/video/select',
            selected: [],
            tips: '选择短剧',
            name: 'original_id',
            field_id: 'id',
            field_Name: 'name',
            elem: '#pVideo'
        }
        let xmSelectOption = {
            url:'/admin/responsibilityPerson/distributorSelect',
            initValue:'',//初始值
            prop: {
                name: 'responsibility_person_name',
                value: 'responsibility_person_id',
            },
            initFn:function(){
                $('#person_ids').val(xmSelectOption.initValue.toString())
            },//有初始值的操作
            el:'#personList',
            direction:'down',//下拉方向
            name:'person_ids'
        }
        let id = GetQueryString('id')
        if (id) {
            Ajax(params.detailUrl, { id }).then(result => {
                selectParams.selected = result.data.partners_id?.toString() ?? []
                videoType.selected = result.data.video_type_id.toString()
                selectVideo.selected = [result.data.original_id]
                xmSelectGetAuthorizersOption.initValue = [result.data.recharge_limit_template_id||0]
                xmSelectOption.initValue = result.data.responsibility_ids
                selectN(selectParams)
                selectN(videoType)
                selectN(selectVideo)
                xmSelectA(xmSelectOption)
                xmSelectA(xmSelectGetAuthorizersOption)
                showAccounts(result.data?.partners_id)
                if(result.data.cover_img){
                    $('.layui-upload-list').show()
                    $('.layui-upload-img').attr('src', result.data.cover_img);
                }
                if(result.data.is_copy == 1){
                    $('#cooperation_time').show()
                }
                let play_platform = result.data.play_platform;
                if(play_platform){
                    let tmp_play_platform_arr = play_platform.split(",");
                    if(tmp_play_platform_arr.indexOf("1")>-1) {
                        $('#wx_play_platform').attr('checked',true);
                    }else{
                        $('#wx_play_platform').removeAttr('checked');
                    }
                    
                    if(tmp_play_platform_arr.indexOf("2") > -1) {
                        $('#dy_play_platform').attr('checked',true);
                    }else {
                        $('#dy_play_platform').removeAttr('checked');
                    }
                    if(tmp_play_platform_arr.indexOf("3") > -1) {
                        $('#ks_play_platform').attr('checked',true);
                    }else {
                        $('#ks_play_platform').removeAttr('checked');
                    }
                    layui.use('form', function(){
                        layui.form.render();
                    });
                }
            });
        } else {
            selectN(selectParams)
            selectN(videoType)
            selectN(selectVideo)
            xmSelectA(xmSelectOption)
            xmSelectA(xmSelectGetAuthorizersOption)
           
        }

        function infoSelectN(option,value){
            if(option.elem == '#pMenu'){
                showAccounts(value)
            }
        }
        
        function showAccounts(value){
            if(value){
                $('.cooperation_mode').show()
            }else{
                $('.cooperation_mode').hide()
            }
        }

        uploadFile({
            elem: '#video_btn', 
            ossUrl:'/admin/video/uploadCredentials',
            uploadSuccessCallback: function (res) {
                $('.layui-upload-list').show()
                $('.layui-upload-img').attr('src', res.url);
                $("input[name='cover_img']").val(res.url);
            }, 
            uploadErrorCallback: function() {
                return layer.msg('上传失败');
            }
        })

        layui.use(['laydate','form'], function(){
            var laydate = layui.laydate;
            laydate.render({
                elem: '#hztime',
                range:['#start_time','#end_time'],
                format: 'yyyy-MM-dd'
            });
            laydate.render({
                elem: '#launch_start_time'
                ,type: 'datetime'
            });
            
            var form = layui.form;
            form.on('radio(is_copy)', function(data){
                if(data.value == 1){
                    $('#cooperation_time').show()
                }else{
                    $('#cooperation_time').hide()
                }
            });
            form.verify({
                checkboxRequired:function(value,dom){
                    if(!form.val('formAjax')['play_platform[0]'] && !form.val('formAjax')['play_platform[1]']&&!form.val('formAjax')['play_platform[2]']){
                        return '请选择播放平台';
                    }
                }
            })
        })
    </script>
</body>

</html>